<%@page import="com.mbbmap.util.EncryptionHelper"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="org.json.simple.*, java.util.TreeMap,com.classes.Casemast,java.util.ArrayList" %>
<%@ page import = "com.mbbmap.util.Constants" %>
<%@ page import = "com.mbbmap.security.dao.*" %>
<%@ include file="/jsp/map/include/user-dao.jsp" %>	
<%
long merchant_id = 0;
long case_id = 0;
String app_type = "";
String ownership_status = "";
String match_trace = "";

if(request.getAttribute("m_case") != null) {
	merchant_id = ((Casemast)request.getAttribute("m_case")).getMerchant().getId();
	case_id = ((Casemast)request.getAttribute("m_case")).getId();
	app_type = ((Casemast)request.getAttribute("m_case")).getType();
	ownership_status = ((Casemast)request.getAttribute("m_case")).getMerchant().getOwnershipStatus();
	match_trace = ((Casemast)request.getAttribute("m_case")).getMerchant().getMatchTrace();
}

String nationality_opt = "<option value='MYS'>MALAYSIA</option>"
		   + "<option value='AUS'>AUSTRALIA</option>"
		   + "<option value='BRN'>BRUNEI</option>"
		   + "<option value='KHM'>CAMBODIA</option>"
		   + "<option value='CHN'>CHINA</option>"
		   + "<option value='HKG'>HONG KONG</option>"
		   + "<option value='IND'>INDIA</option>"
		   + "<option value='IDN'>INDONESIA</option>"
		   + "<option value='JPN'>JAPAN</option>"
		   + "<option value='KOR'>KOREA</option>"
		   + "<option value='MMR'>MYANMAR</option>"
		   + "<option value='NZL'>NEW ZEALAND</option>"
		   + "<option value='PAK'>PAKISTAN</option>"
		   + "<option value='PHL'>PHILIPPINES</option>"
		   + "<option value='PRT'>PORTUGAL</option>"
		   + "<option value='SGP'>SINGAPORE</option>"
		   + "<option value='LKA'>SRI LANKA</option>"
		   + "<option value='TWN'>TAIWAN</option>"
		   + "<option value='THA'>THAILAND</option>"
		   + "<option value='GBR'>UNITED KINGDOM</option>"
		   + "<option value='USA'>UNITED STATE</option>"
		   + "<option value='VNM'>VIETNAM</option>"
		   + "<option value=''>OTHER</option>";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<jsp:include page="include/html-meta.jsp" />
<title>MAYBANK</title>
<script src="<%=request.getContextPath()%>/js/merchant.js"></script>
<script type="text/javascript">
	var index = 1;
	var nationality_opt = "<%= nationality_opt %>";
	
	function on_load(){
		var sel = $('table.match_trace_tbl > tbody').children('tr:eq(0)').children('td:eq(3)').children('select');
		bind_country(sel);
	}
	
	function bind_country(sel){
		sel.on('change', function(event){
			var tr = $(this).closest('tr');
			var tb = tr.children('td:eq(4)').children('input');
			
			if($(this).val().length > 0){
				tb.prop('readonly', true);
				tb.val($(this).val());
			} else {
				tb.prop('readonly', false);
				tb.val('');
			}
			
		});
	}
	
	function add_item() {
		var sel = $('table.match_trace_tbl > tbody').children('tr:eq(0)').children('td:eq(3)').children('select');
		var tr = '<tr data-index="' + ++index + '">'
			+ '<td><input type="text" name="f_name" /></td>'
			+ '<td><input type="text" name="l_name" /></td>'
			+ '<td><input type="text" name="owner_ic" /></td>'
			+ '<td></td>'
			+ '<td><input type="text" name="country_code" readonly="readonly" value="MYS" /></td>'
			+ '<td><a href="javascript:delete_item(' + index + ')">Delete</a></td>'
		+ '</tr>';
		
		tr = $(tr);
		tr.children('td:eq(3)').append(sel.clone().val("MYS"));
		
		$('table.match_trace_tbl > tbody').append(tr);
		
		bind_country(tr.children('td:eq(3)').children('select'));
	}
	
	function delete_item(index) {
		if(confirm('Are you sure to delete?')){
			$('table.match_trace_tbl > tbody').find('tr[data-index=' + index + ']:eq(0)').remove();
		}
	}
	
</script>
</head>

<body onload="on_load()">

<!-- Header -->
<%@ include file="/jsp/common/Header.jsp" %>	
<!-- End Header -->

<div class="row-fluid page">
	<div class="span12">

		<jsp:include page="include/tab.jsp">
			
			<jsp:param name="active" value='<%=EncryptionHelper.encrypt("application") %>' />
		</jsp:include>
		
		<jsp:include page="include/app-tab.jsp">
			
			<jsp:param name="active" value='<%=EncryptionHelper.encrypt("merchant_info") %>' />
		</jsp:include>
		
		<jsp:include page="include/merchant-tab.jsp">
			
			<jsp:param name="active" value='<%=EncryptionHelper.encrypt("match_trace") %>' />
		</jsp:include>
	
		<div class="row-fluid" style="margin-bottom:20px">
			<div class="span3">
				<select id="app_type">
				<%
					String html = "<option value=''>"
								+ 	"<option value='New Application'>New Application</option>"
								+ 	"<option value='Extend Facility'>Extend Facility</option>"
								+ 	"<option value='e-Commerce/M2u'>e-Commerce/M2u</option>"
								+ 	"<option value='Additional Terminal/mPOS Reader'>Additional Terminal/mPOS Reader</option>";
							
					html = html.replace("<option value='" + app_type + "'>", "<option value='" + app_type + "' selected>");
				
					out.println(html);
				%>
				</select>
			</div>
		
			<div class="span2" style="text-align:right; line-height:20px">
				Ownership Status
			</div>
			
			<div class="span7" id="ownership_status">
			<%
				html = "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Sole Proprietary' />Sole Proprietary</label>"
			    	+ "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Partnership' />Partnership</label>"
					+ "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Private Limited' />Private Limited</label>"
					+ "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Public Listed' />Public Listed</label>"
					+ "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Professional' />Professional</label>"
					+ "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Government' />Government</label>"
					+ "<label class='radio inline-block'><input type='radio' name='ownership_status' value='Others' />Others</label>";
					
				html = html.replace("value='" + ownership_status + "'", "value='" + ownership_status + "' checked ");
			
				out.println(html);
			%>
			</div>
		</div>
		
		
		<div class="form-horizontal merchant-main-content" style="height:450px; overflow-y:auto; overflow-x:hidden">
			<div class="row-fluid">
				<div class="span12">
				
					<table class="tbl match_trace_tbl" style="width:98%; margin-bottom:20px">
						<thead>
							<tr>
								<th style="width:20%">First Name</th>
								<th style="width:20%">Last Name</th>
								<th style="width:20%">Owner IC/Passport</th>
								<th style="width:20%">Nationality</th>
								<th style="width:20%">Country Code</th>
								<th style="width:20%"><a href="javascript:add_item()">Add</a></th>
							</tr>
						</thead>
						<tbody>
							<% 
								if(match_trace.length() > 0) {
									JSONArray arr = (JSONArray) JSONValue.parse(match_trace);
									for(int k = 0; k < arr.size(); k++) {
								    	String string = arr.get(k).toString();
								    	JSONObject obj = (JSONObject)JSONValue.parse(string);
		
								    	String f_name = (obj.get("f_name") == null) ? "" : obj.get("f_name").toString().trim();
								    	String l_name = (obj.get("l_name") == null) ? "" : obj.get("l_name").toString().trim();
								    	String ic = (obj.get("ic") == null) ? "" : obj.get("ic").toString().trim();
								    	String nationality = (obj.get("nationality") == null) ? "" : obj.get("nationality").toString().trim();
								    	String country_code = (obj.get("country_code") == null) ? "" : obj.get("country_code").toString().trim();
								    	
								    	html = "<tr data-index=" + k+1 + ">"
											+	"<td><input type='text' name='f_name' value='" + f_name + "' /></td>"
											+	"<td><input type='text' name='l_name' value='" + l_name + "' /></td>"
											+	"<td><input type='text' name='ic' value='" + ic + "' /></td>"
											+	"<td><select name='nationality'>" + nationality_opt + "</select></td>"
											+	"<td><input type='text' name='country_code' value='" + country_code + "' readonly='readonly' /></td>";
										
										if(k > 0) {
											html += "<td><a href='javascript:delete_item(" +  k+1 + ")'>Delete</a></td>";
										}
										else {
											html += "<td></td>";
										}
										
										html = html.replace("<option value='" + nationality + "'>", "<option value='" + nationality + "' selected>");
										
										out.println(html);
									}
								}
								else {
									html = "<tr data-index='1'>"
										+	"<td><input type='text' name='f_name' /></td>"
										+	"<td><input type='text' name='l_name' /></td>"
										+	"<td><input type='text' name='ic' /></td>"
										+	"<td><select name='nationality'>" + nationality_opt + "</select></td>"
										+	"<td><input type='text' name='country_code' readonly='readonly' value='MYS' /></td>"
										+	"<td><a href='javascript:delete_item(1)'>Delete</a></td>";
										
									out.println(html);
								}
							
								
							%>
						
						</tbody>
					</table>
					
					
					<button class="btn" type="button" onclick="merchant.send_match_trace('<%= EncryptionHelper.encrypt(merchant_id+"") %>', '<%= EncryptionHelper.encrypt(case_id+"") %>')">Send to Host</button>
					
				</div>
			</div>
		</div>
		
		<div class="row-fluid">
			<div class="span12 btn-control">
				<input id="click_redirect" name="click_redirect" type="hidden" value="" />
				<button type="button" id="submit" class="btn" onclick="javascript:merchant.create_match_trace('<%= EncryptionHelper.encrypt(merchant_id+"") %>', '<%= EncryptionHelper.encrypt(case_id+"") %>');">Save</button>
			</div>
		</div>
	</div>
</div>

<!-- Footer -->
<%@ include file="/jsp/common/Footer.jsp" %>	
<!-- End Footer -->
</body>
</html>